// gulp的入口文件
// const fs = require('fs')
// exports.foo = () => { //实例
//     console.log('1')
//     done()
// }

//组合api
// const { series, parallel } = require('gulp')  //组合api
// const fs = require('fs')
// const task1 = done => {
//     console.log('task1')
//     done()
// }

// const task2 = done => {
//     console.log('task2')
//     done()
// }
// const task3 = done => {
//     console.log('task3')
//     done()
// }

// exports.foo = series(task1, task2, task3) //串行
// exports.bar = parallel(task1, task2, task3) //并行

// //异步的三种方式
// //回调函数
// exports.callback = done => {
//     console.log('callback')
//     done()
// }
// //promise and async
// exports.promise = () => {
//     console.log('promise')
//     return Promise.resolve()
// }
// const timeout = time => {
//     return new Promise((resolve, reject) => {
//         setTimeout(resolve, time)
//     })

// }
// exports.async = async () => {
//     await timeout(200)
//     console.log('async')
// }

// // stream
// exports.stream = done => {
//     const read = fs.createReadStream('package.json')
//     const write = fs.createWriteStream('temp.txt')
//     read.pipe(write)
//     read.on('end', () => {
//         done
//     })
// }

//核心概念
// const { Transform } = require('stream')
// exports.default = () => {
//     //文件读取
//     const read = fs.createReadStream('caozy.css')
//     //文件写入
//     const write = fs.createWriteStream('caozy.min.css')
//     //文件转化
//     const transform = new Transform({
//         transform: (chunk, encoding, callback) => {
//             //核心转换过程
//             //chunk 读取流中读取到的内容（buffer）
//             const input = chunk.toString()
//             const out = input.replace(/\s+/g, '')
//             callback(null,out)
//         }
//     })
//     read.pipe(write)
//     return read
// }

// //文件操作api
// const { src, dest } = require('gulp')
// const cleanCss = require('gulp-clean-css')
// const rename = require('gulp-rename')
// exports.default = () => {
//     return src('src/*.css').pipe(cleanCss()).pipe(rename({ extname: '.min.css' })).pipe(dest('dist'))
// }

// //样式编译
// const { src, dest } = require('gulp')
// const sass = require('gulp-sass')
// exports.style = () => {
//     return src('src/assets/*.scss', { base: 'src' }).pipe(sass()).pipe(dest('dist'))
// }

// //脚本编译
// const { src, dest } = require('gulp')
// const babel = require('gulp-babel')
// exports.js = () => {
//     return src('src/js/*.js', { base: 'src' }).pipe(babel({ presets: ['@babel/preset-env'] })).pipe(dest('dist'))
// }

// //页面模板编译
// const { src, dest, parallel } = require('gulp')
// const swig = require('gulp-swig')
// const data = {
//     name: 'caozy'
// }
// exports.html = () => {
//     return src('src/*.html', { base: 'src' }).pipe(swig({ data })).pipe(dest('dist'))
// }

// const  compile=parallel(html,js,style)

// 基础打包
const { src, dest, parallel, series, watch } = require("gulp")
// const gulpLoadPlugins =require('gulp-load-plugins')
// const plugins =gulpLoadPlugins()
const Bs = require("browser-sync")
const sass = require("gulp-sass")
const babel = require("gulp-babel")
const imagemin = require("gulp-imagemin")
const swig = require("gulp-swig")
const del = require("del")
//样式
const style = () => {
  return src("src/assets/*.scss", { base: "src" })
    .pipe(sass({ outputStyle: "expanded" }))
    .pipe(dest("dist"))
    .pipe(bs.reload({ stream: true }))
}

//脚本
const script = () => {
  return src("src/js/*.js", { base: "src" })
    .pipe(babel({ presets: ["@babel/preset-env"] }))
    .pipe(dest("dist"))
    .pipe(bs.reload({ stream: true }))
}

// 页面
const data = {
  name: "caozy",
}
const html = () => {
  return src("src/*.html", { base: "src" })
    .pipe(swig({ data }))
    .pipe(dest("dist"))
    .pipe(bs.reload({ stream: true }))
}

//图片
const image = () => {
  return src("src/assets/image/**", { base: "src" })
    .pipe(imagemin())
    .pipe(dest("dist"))
}

//字体
const font = () => {
  return src("src/assets/fonts/**", { base: "src" })
    .pipe(imagemin())
    .pipe(dest("dist"))
}

//其他
const extra = () => {
  return src("public/**", { base: "public" }).pipe(dest("dist"))
}

const clean = () => {
  return del(["dist"])
}
// 合并任务src目录文件
const compile = parallel(html, script, style)

//所有文件构建
const build = series(clean, parallel(compile, extra, image, font))

const dev = series(compile, serve)

//使用bs
const bs = Bs.create()
const serve = () => {
  // watch('src/assets/*.scss',style)
  // watch('src/js/*.js',script)
  // watch('src/*.html',html)
  watch(["src/assets/*.scss", "src/js/*.js", "src/*.html"], bs.reload)
  // watch('src/assets/image/**',image)
  // watch('src/assets/fonts/**',font)
  // watch('public/**',extra)
  bs.init({
    notify: false,
    prot: 8085,
    open: true,
    // files:'dist/**', //file可以不写 指定pipe
    server: {
      baseDir: ["dist", "src", "public"],
      routes: {
        "/node_modules": "node_modules",
      },
    },
  })
}
module.exports = {
  compile,
  build,
  serve,
  dev,
}
